<template>
  <!--<div id="merchant" style="width: 100%;height: 600px">

  </div>-->
  <el-row>
    <el-col :span="10"><div class="grid-content bg-purple" id="main1" style="width:100%;height:600px;margin-top:50px;margin-left:30px" ></div></el-col>
    <el-col :span="14"><div class="grid-content bg-purple-light" id="main" style="width:100%;height:550px;margin-left:20px;margin-top:50px"><consumersZjh></consumersZjh></div></el-col>
  </el-row>
</template>

<script>
  import consumersZjh from "../../components/consumersZjh";
  export default {
    name: "merchant",
    components: {consumersZjh},
    mounted() {
      this.init()
    }, methods: {
      init: function () {
        var myChart = this.$echarts.init(document.getElementById('main1'));
        myChart.setOption({
          title: {
            text: '商户入住数量'
          },
          tooltip: {},
          legend: {
            data: ['2016-2021（户/年）']
          },
          type: 'category',
          xAxis: {

            data: ['2016', '2017', '2018', '2019', '2020']
          },
          yAxis: {
            type: 'value'
          },
          series: [{
            name: '2016-2021（户/年）',
            data: [83, 67, 158, 267, 482],
            type: 'line'
          }]
        });

        myChart.setOption(option);
      }
    }/*,
    data() {

      return {
        tableData: [{
          date: '2021-05-02',
          name: '搜索引擎',
          address: '1666236次',
          type: 123
        }, {
          date: '2021-05-04',
          name: '直接访问',
          address: '1727747次',
          type: 456
        }]
      }
    }*/
  }
  /* methods() {
      init: function() {
        var myChart = this.$echarts.init(document.getElementById('main1'));
        myChart.setOption({
          /!*var dom = document.getElementById('merchant');
      var chart=this.$echarts.init(dom);
      var option = {*!/
          title: {
            text: '商户入住数量'
          },
          tooltip: {},
          legend: {
            data: ['2016-2021（户/年）']
          },
          type: 'category',
          xAxis: {

            data: ['2016', '2017', '2018', '2019', '2020']
          },
          yAxis: {
            type: 'value'
          },
          series: [{
            name: '2016-2021（户/年）',
            data: [83, 67, 158, 267, 482],
            type: 'line'
          }]
          /!* };
      chart.setOption(option);*!/
        });

        myChart.setOption(option);
      }
    },data() {

      return {
        tableData: [{
          date: '2021-05-02',
          name: '搜索引擎',
          address: '1666236次',
          type:123
        }, {
          date: '2021-05-04',
          name: '直接访问',
          address: '1727747次',
          type:456
        }]
      }
    }
  }*/
</script>

<style scoped>

</style>

